<template>
  <div>
    <div>{{ son2 }}</div>
    <button @click="son2 += 1">Son2加1</button>
  </div>
</template>
<script>
export default {
  beforeCreate() {
    console.log("beforeCreate", "son2");
  },
  created() {
    console.log("created", "son2");
  },
};
</script>
<script setup>
console.log("setup", "son2");
const son2 = ref("Son2");
onBeforeMount(() => {
  console.log("onBeforeMount", "son2");
});
onMounted(() => {
  console.log("onMounted", "son2");
});
onBeforeUpdate(() => {
  console.log("onBeforeUpdate", "son2");
});
onUpdated(() => {
  console.log("oneUpdated", "son2");
});
onBeforeUnmount(() => {
  console.log("onBeforeUnmount", "son2");
});
onUnmounted(() => {
  console.log("onUnmounted", "son2");
});
</script>


<style lang="scss" scoped>

</style>